<template>
	<view class="content">
		<view class="info-con">
			<view style="display: flex;align-items: center;color: #000000;font-size: 27rpx;">
				<view class="re-bg"></view>
				<view style="margin-left: 10rpx;">缴费订单</view>
			</view>
			<view class="flex-row" style="margin-top: 32rpx;">
				<view>就诊人姓名</view>
				<view class="info-text">
					<u--text mode="name" :text="name" format="encrypt"></u--text>
				</view>
			</view>
			<u-line color="#E7E7E7"></u-line>
			<view class="flex-row">
				<view>患者卡号</view>
				<view v-if="card" class="info-text">
					{{card.substr(0, 1) + '****************' + card.substr(-1, 1)}}
				</view>
			</view>
			<u-line color="#E7E7E7"></u-line>

			<view class="flex-row">
				<view>就诊医生</view>
				<view class="info-text" style="display: flex;align-items: center;">
					<text>{{admDoctor}}</text>
					<text style="margin-left: 10rpx;">({{admDept}})</text>
				</view>
			</view>
			<u-line color="#E7E7E7"></u-line>
			<view class="flex-row">
				<view>金额</view>
				<view class="info-text" style="color: #FF1212">￥{{admTotalMoney}}</view>
			</view>
			<u-line color="#E7E7E7"></u-line>
			<view class="flex-row">
				<view>就诊日期</view>
				<view class="info-text">{{admDateTime}}</view>
			</view>

		</view>
		<view class="reslut-but">
			<view style="width: 329rpx;height: 85rpx;">
				<u-button type="primary" plain text="就诊卡余额缴费" @click="cardPay"></u-button>
			</view>

			<view style="width: 329rpx;height: 85rpx;">
				<!-- #ifdef H5 -->
				<u-button type="primary" text="微信支付" @click="wxPay"></u-button>
				<!-- #endif -->
				<!-- #ifdef MP-ALIPAY -->
				<u-button type="primary" text="支付宝支付" @click="zfbPay"></u-button>
				<!-- #endif -->
			</view>

		</view>
		<!-- v-if="selectUser.patientCard==='200090733'" -->
		<view class="yibao-pay" @click="goYibao">
			<image src="../../static/medical-logo.png" style="width: 80rpx;height: 24rpx;"></image>
			<view style="margin-left: 15rpx;">
				医保支付
			</view>

		</view>
		<view style="width: 688rpx;margin: 0 auto;">
			<view style="font-weight: bold;color: red;font-size: 35rpx;margin-top: 31rpx;">温馨提示：</view>
			<view style="font-weight: bold;color: #000;font-size: 31rpx;margin-top: 8rpx;">目前只支持本人医保移动支付，非本人暂不支持。</view>
		</view>

	</view>
</template>

<script>
	import {
		payApi,
		createApi,
		authinfoApi
	} from "@/api/user"
	export default {
		data() {
			return {
				id: '',
				name: '',
				card: '',
				admDoctor: '',
				admDept: '',
				admTotalMoney: '',
				admDateTime: '',
				receiptNo: '',
				yibaoData: '',
				selectUser: {},
			}
		},

		onLoad(option) {
			this.selectUser = uni.getStorageSync('selectUser')
			this.yibaoData = decodeURIComponent(option.item)
			const item = JSON.parse(decodeURIComponent(option.item));
			this.id = item.id
			this.name = item.name
			this.card = item.card
			this.admDoctor = item.admDoctor
			this.admDept = item.admDept
			this.admTotalMoney = item.admTotalMoney
			this.admDateTime = item.admDateTime
			this.receiptNo = item.receiptNo
		},
		methods: {
			// #ifdef H5
			goYibao() {
				// const orgChnlCrtfCodg = encodeURIComponent(
				// 	'BqK1kMStlhVDgN2uHf4EsLK/F2LjZPYJ81nK2eYQqxtjNCe9M5uGsDRcTKXsMLib')

				const orgChnlCrtfCodg = encodeURIComponent(
					'BqK1kMStlhVDgN2uHf4EsLK/F2LjZPYJ81nK2eYQqxtjNCe9M5uGsDRcTKXsMLib')

				console.log(orgChnlCrtfCodg);
				// const redirectUrl = encodeURIComponent(
				// 	`http://sqslyy.e0s.cn:8677/dev-api/au/weiXinMp/medical/callback/${this.openid}`)
				const redirectUrl = encodeURIComponent(
					`https://sqsl.e0s.cn/#/pages/yibao/yibao?yibaoData=${this.yibaoData}`
				)
				console.log(redirectUrl);
				//const url =
				//`https://exp.wecity.qq.com/oauth/code?authType=2&isDepart=2&appid=wxca0c462b619d3b6b&cityCode=411401&channel=AAFyAhOV9Ft9TmYlxWO8ENXo&orgChnlCrtfCodg=${orgChnlCrtfCodg}&orgCodg=H41140300290&bizType=04107&orgAppId=1H3BT00H002U3F60C80A0000EA673828&redirectUrl=${redirectUrl}`
				const url =
					`https://card.wecity.qq.com/oauth/code?authType=2&isDepart=2&appid=wxca0c462b619d3b6b&cityCode=411401&channel=AAFyAhOV9Ft9TmYlxWO8ENXo&orgChnlCrtfCodg=${orgChnlCrtfCodg}&orgCodg=H41140300290&bizType=04107&orgAppId=1INDU0A840008D430B0A00004D3497CA&redirectUrl=${redirectUrl}`

				console.log(url);
				// window.open(url)
				window.location.href = url
			},
			// #endif 
			// #ifdef MP-ALIPAY
			goYibao() {
				uni.showLoading({
					mask: true,
					title: '支付中...'
				})
				uni.getAuthCode({
					scopes: ['nhsamp', 'auth_user'],
					success: async (res) => {
						const resa = await authinfoApi({
							authCode: res.authCode
						})
						uni.hideLoading()
						uni.setStorageSync('yibaoData', this.yibaoData)
						if (resa.data.payAuthNo) {
							uni.navigateTo({
								url: `/pages/yibao/yibao`
							})
						} else {
							uni.ap.openURL({
								url: encodeURI(resa.data.authUrl)
							})
						}

					}
				})
			},
			// #endif 

			async cardPay() {
				try {
					uni.showLoading({
						title: '缴费中...',
						mask: true
					})
					const res = await payApi({
						id: this.id,
						receiptNo: this.receiptNo,
						money: this.admTotalMoney,
					})
					uni.hideLoading()
					uni.redirectTo({
						url: '/pages/paysucceed/paysucceed'
					})
				} catch (e) {
					uni.hideLoading()
				}
			},
			async zfbPay() {
				try {
					uni.showLoading({
						title: '缴费中...',
						mask: true
					})
					const res = await createApi({
						id: this.id,
						type: 3,
						money: this.admTotalMoney,
						receiptNo: this.receiptNo,
						payCardTypeId: '25',
					})
					uni.hideLoading()
					uni.requestPayment({
						provider: 'alipay',
						tradeNO: JSON.parse(res.msg).alipay_trade_create_response.trade_no,
						success: (res) => {
							console.log('success:' + JSON.stringify(res));
							if (res.resultCode == 9000) {
								uni.redirectTo({
									url: '/pages/paysucceed/paysucceed'
								})
							} else if (res.resultCode == 6001) {
								uni.$u.toast('取消支付')
							} else {
								uni.$u.toast('支付失败')
							}

						},
						fail: (err) => {
							console.log('fail:' + JSON.stringify(err));
							uni.$u.toast('支付失败')
						}
					});
				} catch (e) {
					uni.hideLoading()
				}

			},
			async wxPay() {
				try {
					uni.showLoading({
						title: '缴费中...',
						mask: true
					})
					const res = await createApi({
						id: this.id,
						type: 3,
						money: this.admTotalMoney,
						receiptNo: this.receiptNo,
						payCardTypeId: '24',
					})
					uni.hideLoading()
					this.wxpayOrder(JSON.parse(res.msg))
				} catch (e) {
					uni.hideLoading()
				}

			},
			wxpayOrder(data) {
				if (typeof WeixinJSBridge === 'undefined') {
					if (document.addEventListener) {
						document.addEventListener('WeixinJSBridgeReady', this.onBridgeReady(data), false)
					} else if (document.attachEvent) {
						document.attachEvent('WeixinJSBridgeReady', this.onBridgeReady(data))
						document.attachEvent('onWeixinJSBridgeReady', this.onBridgeReady(data))
					}
				} else {
					this.onBridgeReady(data)
				}
			},
			onBridgeReady(etr) {
				let that = this
				WeixinJSBridge.invoke( //这个对象只有微信浏览器支持
					'getBrandWCPayRequest', etr,
					function(res) {
						if (res.err_msg == 'get_brand_wcpay_request:ok') {
							uni.redirectTo({
								url: '/pages/paysucceed/paysucceed'
							})
						} else {
							uni.$u.toast('缴费失败')
						}
					})

			},
		}
	}
</script>

<style scoped>
	.content {
		width: 100vw;
		min-height: 100%;
		background: #F8F8F8;
		color: #666666;
		font-size: 27rpx;
	}

	.info-con {
		width: 750rpx;
		padding: 0 31rpx;
		padding-top: 23rpx;
		box-sizing: border-box;
		background: #FFFFFF;
	}

	.flex-row {
		display: flex;
		align-items: center;
		padding: 21rpx 0;
	}

	.info-text {
		margin-left: auto;
		color: #000000;
	}

	.user-lista {
		width: 688rpx;
		height: 185rpx;
		background: linear-gradient(135deg, #05A2FF 0%, #0CCFFF 100%);
		border-radius: 19rpx;
		padding: 31rpx;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		color: #FFFFFF;
		font-size: 23rpx;
	}

	.re-bg {
		background-color: #05A2FF;
		width: 20rpx;
		height: 20rpx;
		border-radius: 50%;
	}

	.list-texta {
		height: 100%;
		margin-left: 23rpx;
		display: flex;
		flex-direction: column;
		justify-content: space-between;

	}

	.user-buta {
		margin-left: auto;
		width: 146rpx;
		height: 62rpx;
		background: #FFFFFF;
		border-radius: 31rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		color: #05A2FF;
	}

	.reslut-but {
		display: flex;
		justify-content: space-between;
		margin: 0 31rpx;
		margin-top: 92rpx;

	}

	.yibao-pay {
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 0 auto;
		margin-top: 31rpx;
		border: 1px solid #4d9cd4;
		font-size: 30rpx;
		width: 688rpx;
		height: 38px;
		color: #4d9cd4;
		border-radius: 3px;
	}

	.pop-con {
		padding: 31rpx;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.pop-title {
		width: 100%;
		text-align: center;
		font-weight: 500;
		color: #000000;
		font-size: 31rpx;
	}

	.scroll-y {
		height: 400rpx;
		width: 688rpx;
		margin-top: 31rpx;
		box-sizing: border-box;
	}

	.user-list {
		width: 688rpx;
		height: 190rpx;
		background: #FFFFFF;
		border-radius: 19rpx;
		padding-left: 19rpx;
		padding-right: 29rpx;
		padding-top: 23rpx;
		padding-bottom: 44rpx;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		margin-bottom: 23rpx;
		box-shadow: 0px 0 13rpx 0px rgba(5, 162, 255, 0.11);
		color: #999999;
		font-size: 23rpx;
	}

	.list-text {
		height: 100%;
		margin-left: 23rpx;
		display: flex;
		flex-direction: column;
		justify-content: space-between;

	}

	.book-but {
		width: 688rpx;
		height: 85rpx;
		margin: 0 auto;
		margin-top: 31rpx;
	}
</style>